<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="../../css/oksub.css">
    <link rel="stylesheet" href="../../lib/layui/css/layui.css">
</head>
<body>
<div class="page-fill" style="margin-top: 10%">
    <div style="width: 100%;height: 100%;">
        <form class="layui-form" action=""  style="width: 550px;height: 500px;margin: 50px auto;box-shadow: #e3e3e3 10px 10px 30px 5px;padding-top: 80px">
            <div style="margin: 0 auto;width: 450px;height: 60px;text-align: center">
                <h2 style="color: #121a65">注册</h2>
            </div>
            <div style="margin: 0 auto;width: 400px;height: 270px;">
                <div class="layui-form-item" style="margin-top: 30px">
                    <label class="layui-form-label">姓名&#12288;</label>
                    <div class="layui-input-block">
                        <input style="float: left;" type="text"
                               class="layui-input" placeholder="请输入原姓名" lay-verify="required" autocomplete="off"></div>
                </div>
                <div class="layui-form-item" style="margin-top: 30px">
                    <label class="layui-form-label">所在地址&#12288;</label>
                    <div class="layui-input-block">
                        <input style="float: left;" type="text"
                               class="layui-input" placeholder="请输入所在地址" lay-verify="required" autocomplete="off">
                    </div>
                </div>
                <div class="layui-form-item" style="margin-top: 30px">
                    <label class="layui-form-label">所在医院</label>
                    <div class="layui-input-block">
                        <div class="layui-form-item layui-form-text" style="display: inline" id="select">
                            <select name="director" id="director" lay-filter="" lay-verify="required">
                                <option value='1'>医院1</option>
                                <option value='2'>医院2</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item" style="margin-top: 30px">
                    <label class="layui-form-label">电话号码&#12288;</label>
                    <div class="layui-input-block">
                        <input style="float: left;" type="text"
                               class="layui-input" placeholder="请输入电话号码" lay-verify="required" autocomplete="off">
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button type="button" lay-submit="" lay-filter="" class="layui-btn layui-btn-normal"
                                style="width:400px;margin-top:30px; float: right">注&#12288;册
                        </button>
                        <div style="width:400px;margin-top:30px; float: right"><div style="float: right">已有账号: <a style="color: #0c199c" href="../../login.html">登录</a></div></div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script src="../../js/jquery.min.js"></script>

<script>
    if (window != top) {
        top.location.href = location.href;
    }
    ;

    layui.use(["form", 'layer'], function () {
        let form = layui.form;
        let $ = layui.jquery;

        form.render();

        /**
         * 表单input组件单击时
         */
        $("#login .input-item .layui-input").click(function (e) {
            e.stopPropagation();
            $(this).addClass("layui-input-focus").find(".layui-input").focus();
        });

        /**
         * 表单input组件获取焦点时
         */
        $("#login .layui-form-item .layui-input").focus(function () {
            $(this).parent().addClass("layui-input-focus");
        });

        /**
         * 表单input组件失去焦点时
         */
        $("#login .layui-form-item .layui-input").blur(function () {
            $(this).parent().removeClass("layui-input-focus");
            if ($(this).val() != "") {
                $(this).parent().addClass("layui-input-active");
            } else {
                $(this).parent().removeClass("layui-input-active");
            }
        })
    });
</script>
</body>
</html>
